<template>
  <!-- 面包屑组件 -->
  <!-- <p>{{nav[0].name}} / {{nav[1].name}}</p> -->
  <p>
    <span v-for="(item, index) in nav" :key="index">
      <span :style="{ color: index == nav.length - 1 ? '#333' : '#999' }">
        {{ item.name }}</span
      >
      <!-- 不等于最后一行 就展示 斜杠-->
      <i v-show="index != nav.length - 1">/</i>
    </span>
  </p>
</template>

<script>
export default {
  props: ["nav"],
  data() {
    return {};
  },
};
</script>

<style lang = "less" scoped>
p {
  margin: 20px 0;
  i {
    margin: 0 10px;
  }
}
</style>